<template>
  <div ref="canvasL" id="canvas-l" class="canvas-l" v-if="showcanvas"></div>
</template>

<script lang="ts">
import { defineComponent, onMounted, ref } from "vue";
import ParameterMethod from "@/utils/ParameterMethod";

import ready from "@/pixi/ready";

Promise.resolve() //创建画铺
  .then() // 加载素材
  .then(() => {}); // 设置动画
export default defineComponent({
  name: "App",
  components: {},
  setup() {
    const showcanvas = ref(true);
    const canvasL: any = ref(null);
    const initialization = async () => {
      const DomEl = canvasL.value;
      let appview = ParameterMethod.APP.view;
      await DomEl.appendChild(appview);
      ready.handle(DomEl)
      await ParameterMethod.ListeningEvent.emit("ready", DomEl);
    };
    onMounted(() => {
      initialization();
      window.addEventListener("resize", () => {
        // 变化后需要做的事
        ParameterMethod.Reset();
      });
    });
    return {
      canvasL,
      showcanvas,
    };
  },
});
</script>

<style>
.canvas-l {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  /* background: red; */
}
</style>
